<template>
  <div>
    <h2>{{ info }}</h2>
    <button @click="changeInfo">修改age</button>
  </div>
</template>

<script>
import { ref, triggerRef } from "vue";

export default {
  setup() {
    const info = shallowRef({ name: "why" });

    const changeInfo = () => {
      info.value.name = "james";
      triggerRef(info);
    };
    return { info, changeInfo };
  },
};
</script>

<style scoped></style>
